console.log("index注入成功")


/******************************************************内容渲染******************************************************************************/


//页面内容  
// 登录页面展示
createLogin()
// 信息页面
CreateGetinfoPopup()  //问题
//信息数据添加
CreateInfoDataAdd()  //问题


//登录内容
function createLogin() {

    let LoginPage = document.createElement("div")
    LoginPage.classList.add("login_box")
    LoginPage.classList.add("active")
    LoginPage.innerHTML = `
    <div class="login_dec">
        <div class="close">
            <div class="logo2"> X </div>
        </div>
        <h3>网站信息抓取助手</h3>
        <div class="form_list">
            <div class="form_item">
                <input type="text" placeholder="账号" id="username">
            </div>
            <div class="form_item pwd">
                <input type="password" placeholder="密码" id="password">
            </div>
            <div class="login_btn_tc" id="loginBtnTc">
                登录
            </div>
            <div class="my_link">
                <a href="http://www.topeasychina.com/signup.html" target="_blank">立即注册</a><span>|</span>
                <a href="http://www.topeasychina.com/forget.html" target="_blank">忘记密码</a><span>|</span>
                <a href="http://www.topeasychina.com/TopeasyUserAgreement/TopeasyUserAgreement.html" target="_blank">《隐私权政策》</a>
            </div>
        </div>
    </div>
`
    document.querySelector('html').appendChild(LoginPage)

    //登录页面  关闭点击事件
    document.querySelector(".login_dec>.close").onclick = function () {
        document.querySelector(".login_box").classList.add("active");

    }

    //登录  点击事件
    document.querySelector("#loginBtnTc").onclick = async function () {

        let username = document.querySelector("#username").value;
        let password = document.querySelector("#password").value

        let data = {
            type: "login",
            "url": window.location.href,
            'LoginId': EncodeStrXor(username),
            'LoginPwd': EncodeStrXor(password)
        }

        await chrome.runtime.sendMessage({ "data": data }, async function (response) {
            // chrome.storage.local.get("TopeasyAccountCode", function (result) {
            console.log(response, "responseresponse")
            if (response.status == 1) {
                document.querySelector(".login_box").classList.add("active");

                ChromePopUp("登录成功 请再次获取");


            } else {
                console.log("登录失败")
                ChromePopUp("登录失败");
            }
        })
        return true;

    }

}

//保存邮箱页面渲染
function CreateGetinfoPopup() {
    let GetInfoPage = document.createElement("div")
    GetInfoPage.classList.add("GetInfo_box")
    GetInfoPage.classList.add("active")
    GetInfoPage.innerHTML = `
    <div class="Page_Contact_Information">
    <div class="Page_Contact_Information_header">
        <div class="Page_Contact_Information_hedaer_left">页面联系方式</div>
        <div class="Page_Contact_Information_header_right">X</div>
    </div>

    <div class="Page_Contact_Information_content">
        <div class="Page_Contact_Information_content_NoData active">无数据</div>
        <div class="Page_Contact_Information_content_item active">
        </div>
    </div>

    <div class="Page_Contact_Information_footer">
        <div >一键保存</div>
    </div>
    </div>
`

    document.querySelector("html").appendChild(GetInfoPage)

    //数据获取页面 关闭点击事件
    document.querySelector(".Page_Contact_Information_header_right").onclick = function () {
        document.querySelector(".GetInfo_box").classList.add("active");
        document.querySelector(".Page_Contact_Information_content_NoData").classList.add("active");
        document.querySelector(".Page_Contact_Information_content_item").classList.add("active");
    }


    //数据获取页面 所有     全部保存点击事件
    document.querySelector(".Page_Contact_Information_footer").onclick = async function () {
        //获取所有的邮箱 内容一些 东西
        let Emails = document.querySelectorAll('.Page_Contact_Information_content_item_content_input>input')

        chrome.storage.local.get('TopeasyAccountCode', function (result) {


            if (result.TopeasyAccountCode != null && result.TopeasyAccountCode != "undefined") {

                let requestdata = {
                    "id": "",
                    "AccountCode": EncodeStrXor(result.TopeasyAccountCode),
                    "Domain": window.location.href.split("://")[1].split("/")[0],
                    "Protocol": window.location.href.split("://")[0],
                    "Trip": "",
                    "DomainContactWareHouseList": []
                }

                for (let i = 0; i < Emails.length; i++) {
                    let AllEmails = {
                        "Id": "",
                        "DomainId": "",
                        "ContactType": "0",
                        "ContactValue": Emails[i].value,
                        "SourceUrl": window.location.href.split("://")[1].split("/")[0],
                        "SourceType": "0",
                        "Trip": ""
                    }
                    requestdata.DomainContactWareHouseList.push(AllEmails)
                }

                let data = {
                    type: "AllDataSave",
                    EncryptAccountCode: EncodeStrXor(result.TopeasyAccountCode),
                    mAccountCode: result.TopeasyAccountCode,
                    data: requestdata
                }

                console.log(data)
                chrome.runtime.sendMessage({ "data": data }, function (response) {
                    // layer.msg(response.msg)
                    console.log(response, "响应所有文件")
                    if (response.status == 1) {
                        console.log("保存成功")
                        ChromePopUp("保存成功")
                    } else {
                        ChromePopUp("保存失败")
                        console.log("保存失败");
                    }
                });
            } else {
                //去登陆
                console.log("没登陆")

                document.querySelector(".login_box").classList.remove("active");
            }
        })


        //数据 排序

        // //全部隐藏
        document.querySelector(".GetInfo_box").classList.add("active");
        if (document.querySelector(".Page_Contact_Information_content_NoData") != null) {
            document.querySelector(".Page_Contact_Information_content_NoData").classList.add("active");
        }
        document.querySelector(".Page_Contact_Information_content_item").classList.add("active");
    }

}

//添加信息内容
function CreateInfoDataAdd() {

    let infoDataAddPage = document.createElement("div")
    infoDataAddPage.classList.add("add_box")
    infoDataAddPage.classList.add("active")

    infoDataAddPage.innerHTML = `
    <div class="add_dec" style="text-align: left;">
        <div class="tpclose"></div>
        <div class="add_title">新增</div>
        <div class="" style="padding-left: 30px;margin-top: 10px;">
            <span style="cursor: pointer;color: cornflowerblue;" title="点击前往查看汇总信息" id="toView">点击前往查看汇总列表</span>
        </div>
        <div class="form" >
            <div class="form_item">
                <div class="min_title">域名:</div>
                <input type="text" placeholder="请输入" id="Domain">
            </div>
            <div class="form_item">
                <div class="min_title">数据类型:</div>
                <div class="radio_list" id="ContactType">

                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>邮箱</span>
                    </div>
                    <div class="radio_item ">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>电话</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>传真</span>   
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>地址</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect"  name="" id="">
                        <span>公司名称</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Facebook</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Twitter</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Linkedin</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Skype</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>YouTube</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Instagram</span>
                    </div>
                    <div class="radio_item">
                        <input type="radio" class="radioSelect" name="" id="">
                        <span>Pinterest</span>
                    </div>
                </div>

            </div>
            <div class="form_item">
                <div class="min_title">数据内容:</div>
                <input type="text" placeholder="请输入" id="ContactValue">
            </div>
            <div class="form_item">
                <div class="min_title">备注:</div>
                <input type="text" placeholder="请输入" id="Trip">
            </div>
            <div style="display: none;"><span id="tpSourceUrl"></span></div>
        </div>

        <div class="form_footer">
            <div class="form_footer_btn form_footer_btn_tpcancel" style="color: rgb(0, 0, 0);background: #ffff;">取消</div>
            <div class="form_footer_btn affirmAdd">添加</div>
        </div>
    </div>
`

    document.querySelector("html").appendChild(infoDataAddPage)


    //数量新增  页面跳转
    document.querySelector("#toView").onclick = async function () {
        let data = {
            type: "toView"
        }
        await chrome.runtime.sendMessage({ "data": data }, async function (response) {
            console.log(response)
        })

    }

    //取消点击事件
    document.querySelector(".form_footer_btn_tpcancel").onclick = function () {
        for (let i = 0; i < document.querySelectorAll(".radio_item").length; i++) {
            document.querySelectorAll(".radio_item")[i].querySelector(".radioSelect").checked = false
        }
        document.querySelector(".add_box").classList.add("active")
    }


    //添加点击事件
    document.querySelector(".affirmAdd").onclick = function () {
        //域名
        let DomainName = document.querySelector("#Domain").value
        //类型
        let radioItem = document.querySelectorAll(".radio_item")
        let radioName = "";
        for (let i = 0; i < radioItem.length; i++) {
            if (radioItem[i].querySelector(".radioSelect").checked == true) {
                radioName = radioItem[i].querySelector("span").innerText
            }
        }

        // 数据内容
        let dataContent = document.querySelector("#ContactValue").value

        // 备注
        let Trip = document.querySelector("#Trip").value


        chrome.storage.local.get('TopeasyAccountCode', function (result) {
            if (result.TopeasyAccountCode != null && result.TopeasyAccountCode != "undefined") {

                let requestdata = {
                    "id": "",
                    "AccountCode": result.TopeasyAccountCode,
                    "Domain": DomainName,
                    "Protocol": window.location.href.split("://")[0],
                    "Trip": Trip,
                    "DomainContactWareHouseList": [
                        {
                            "Id": "",
                            "DomainId": "",
                            "ContactType": radioName,
                            "ContactValue": dataContent,
                            "SourceUrl": DomainName,
                            "SourceType": "0",
                            "Trip": Trip
                        }
                    ]
                }

                let data = {
                    type: "AddDomain",
                    mAccountCode: EncodeStrXor(result.TopeasyAccountCode),
                    data: requestdata
                }
                chrome.runtime.sendMessage({ "data": data }, function (response) {
                    // console.log(response, "返回")
                    // layer.msg(response.msg)
                    console.log(response, "响应添加点击事件")
                    if (response.status == 1) {
                        // alert("添加成功")
                        ChromePopUp("添加成功")
                    } else {
                        // alert("内容过多,添加失败")
                        ChromePopUp("内容过多,添加失败")
                    }
                });
            }



        })

        for (let i = 0; i < document.querySelectorAll(".radio_item").length; i++) {
            document.querySelectorAll(".radio_item")[i].querySelector(".radioSelect").checked = false
        }
        document.querySelector(".add_box").classList.add("active")
    }


}


//保存数据页面渲染
function IsFlagRender(ReplyMessage) {

    console.log(ReplyMessage, "**内容渲染***")

    if (ReplyMessage.Emails.length == 0
        && ReplyMessage.Phones.length == 0
        && ReplyMessage.Facebooks.length == 0
        && ReplyMessage.Instagrams.length == 0
        && ReplyMessage.Twitters.length == 0
        && ReplyMessage.YouTubes.length == 0

        && ReplyMessage.Linkedins.length == 0
        && ReplyMessage.Skypes.length == 0
        && ReplyMessage.Pinterests.length == 0
    ) {
        console.log("没数据")
        document.querySelector(".Page_Contact_Information_content_NoData").classList.remove("active")
        return;
    } else {
        console.log("有数据")
        document.querySelector(".Page_Contact_Information_content_item").innerHTML = "";
        document.querySelector(".Page_Contact_Information_content_item").classList.remove("active")

        if (ReplyMessage.Emails.length > 0) {

            DataRender("邮箱", ReplyMessage.Emails)
        }
        if (ReplyMessage.Phones.length > 0) {

            DataRender("电话", ReplyMessage.Phones)
        }
        if (ReplyMessage.Facebooks.length > 0) {

            DataRender("FaceBook", ReplyMessage.Facebooks)

        }
        if (ReplyMessage.Instagrams.length > 0) {

            DataRender("Instagram", ReplyMessage.Instagrams)

        }

        if (ReplyMessage.Twitters.length > 0) {

            DataRender("Twitter", ReplyMessage.Twitters)

        }
        if (ReplyMessage.YouTubes.length > 0) {

            DataRender("YouTube", ReplyMessage.YouTubes)
        }
        if (ReplyMessage.Linkedins.length > 0) {
            DataRender("Linkedin", ReplyMessage.Linkedins)
        }

        if (ReplyMessage.Skypes.length > 0) {
            DataRender("Skype", ReplyMessage.Skypes)
        }

        if (ReplyMessage.Pinterests.length > 0) {
            DataRender("Pinterest", ReplyMessage.Pinterests)
        }
    }
    SaveOnceData()

}

// 数据渲染
function DataRender(type, data) {
    data.forEach(item => {
        document.querySelector(".Page_Contact_Information_content").innerHTML +=
            ` <div class="Page_Contact_Information_content_item">
                <div class="Page_Contact_Information_content_item_title">
                    ${type}
                </div>
                <div class="Page_Contact_Information_content_item_content">
                    <div class="Page_Contact_Information_content_item_content_input">
                        <input type="text" name="" id="" value=${item}>
                    </div>

                    <div class="Page_Contact_Information_content_item_content_button">
                        保存
                    </div>
                </div>
            </div>
        `
    });
}


// 弹窗
function ChromePopUp(data) {
    console.log("弹窗插入")
    let ChromePopUpDiv = document.createElement("div")
    ChromePopUpDiv.className = "ChromePopUp"
    let ChromePopUpChild = document.createElement("div")
    ChromePopUpChild.textContent = data
    ChromePopUpDiv.appendChild(ChromePopUpChild)
    document.querySelector("html").appendChild(ChromePopUpDiv)
    setTimeout(() => {
        ChromePopUpDiv.remove()
    }, 3000);
}